<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<%@taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta charset="utf-8">
    <meta http-equiv="x-ua-compatible" content="ie=edge">
    <title></title>
    <meta name="robots" content="noindex, follow" />
    <meta name="description" content="">
    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
    <!-- Favicon -->
	<link href="apple-touch-icon.png" rel="apple-touch-icon">
	<link href="favicon.png" rel="icon">

	<link
		href="https://fonts.googleapis.com/css?family=Archivo+Narrow:300,400,700%7CMontserrat:300,400,500,600,700,800,900"
		rel="stylesheet">
	<link rel="stylesheet" href="plugins/font-awesome/css/font-awesome.min.css">
	<link rel="stylesheet" href="plugins/ps-icon/style.css">
	<!-- CSS Library-->
	<link rel="stylesheet" href="plugins/bootstrap/dist/css/bootstrap.min.css">
	<link rel="stylesheet" href="plugins/owl-carousel/assets/owl.carousel.css">
	<link rel="stylesheet" href="plugins/jquery-bar-rating/dist/themes/fontawesome-stars.css">
	<link rel="stylesheet" href="plugins/slick/slick/slick.css">
	<link rel="stylesheet" href="plugins/bootstrap-select/dist/css/bootstrap-select.min.css">
	<link rel="stylesheet" href="plugins/Magnific-Popup/dist/magnific-popup.css">
	<link rel="stylesheet" href="plugins/jquery-ui/jquery-ui.min.css">
	<link rel="stylesheet" href="plugins/revolution/css/settings.css">
	<link rel="stylesheet" href="plugins/revolution/css/layers.css">
	<link rel="stylesheet" href="plugins/revolution/css/navigation.css">
	<!-- Custom-->
	<link rel="stylesheet" href="css/style.css">
	<!--HTML5 Shim and Respond.js IE8 support of HTML5 elements and media queries-->
	<!--WARNING: Respond.js doesn't work if you view the page via file://-->
	<!--[if lt IE 9]><script src="https://oss.maxcdn.com/libs/html5shiv/3.7.0/html5shiv.js"></script><script src="https://oss.maxcdn.com/libs/respond.js/1.4.2/respond.min.js"></script><![endif]-->
	<link rel="stylesheet" href="css/index.css">
	
		
	 <!-- google fonts -->
    <link href="https://fonts.googleapis.com/css?family=Nunito+Sans:300,300i,400,400i,600,700,800,900%7CPoppins:300,400,500,600,700,800,900" rel="stylesheet">
    <!-- Bootstrap CSS -->
    <link rel="stylesheet" href="assets/css/vendor/bootstrap.min.css">
    <!-- Font-awesome CSS -->
    <link rel="stylesheet" href="assets/css/vendor/font-awesome.min.css">
    <!-- Slick slider css -->
    <link rel="stylesheet" href="assets/css/plugins/slick.min.css">
    <!-- animate css -->
    <link rel="stylesheet" href="assets/css/plugins/animate.css">
    <!-- Nice Select css -->
    <link rel="stylesheet" href="assets/css/plugins/nice-select.css">
    <!-- jquery UI css -->
    <link rel="stylesheet" href="assets/css/plugins/jqueryui.min.css">
    <!-- main style css -->
    <link rel="stylesheet" href="assets/css/style.css">
<title>${user.username }的个人信息</title>

</head>
<body>

	<header class="header">
		<nav class="navigation">
			<div class="container-fluid">
				<div class="navigation__column left" id="mylogo">
					<div class="header__logo"><a class="ps-logo" href="index.html"><img src="images/logo.png"
								alt=""></a>

					</div>

				</div>
				<div class="navigation__column center" id="mycenter">
					<ul class="main-menu menu" id="login-menu">
					<c:if test="${user!=null }">
					<li class="menu-item menu-item-has-children dropdown"><a href="${pageContext.request.contextPath }/gerenxinxi">欢迎${user.username }来到Tsport！</a>
						
					</li>
					<li class="menu-item menu-item-has-children dropdown" ><a href="${pageContext.request.contextPath }/Logout">退出登录</a>
							
					</li>
					</c:if>
					<c:if test="${user==null }">
					<li class="menu-item menu-item-has-children dropdown"><a href="${pageContext.request.contextPath }/login.jsp">登录/注册</a>
							
					</li>
					</c:if>
					</ul>	
					<ul class="main-menu menu" id="centermenu" >
					
					</ul>
				</div>
				<div class="navigation__column right">
					<form class="ps-search--header" action="do_action" method="post">
						<input class="form-control" type="text" placeholder="Search Product…">
						<button><i class="ps-icon-search"></i></button>
					</form>
					<div class="ps-cart"><a class="ps-cart__toggle" href="#"><span><i>20</i></span><i
								class="ps-icon-shopping-cart"></i></a>
						<div class="ps-cart__listing">
							<div class="ps-cart__content" id="cart_content">
									
									
							</div>
							<div class="ps-cart__total" >
								<p>Number of items:<span id="items"></span></p>
								<p>Item Total:<span id="total"></span></p>
							</div>
							<div class="ps-cart__footer"><a class="ps-btn" href="cart.html">Check out<i
										class="ps-icon-arrow-left"></i></a>
							</div>
						</div>
					</div>
					<div class="menu-toggle"><span></span></div>
				</div>
			</div>
		</nav>
	</header>

    <!-- offcanvas search form start -->
    <div class="offcanvas-search-wrapper">
        <div class="offcanvas-search-inner">
            <div class="offcanvas-close">
                <i class="fa fa-close"></i>
            </div>
            <div class="container">
                <div class="offcanvas-search-box">
                    <form class="d-flex bdr-bottom w-100">
                        <input type="text" placeholder="Search entire storage here...">
                        <button class="search-btn"><i class="fa fa-search"></i>search</button>
                    </form>
                </div>
            </div>
        </div>
    </div>
    <!-- offcanvas search form end -->

    <main>
        <!-- breadcrumb area start -->
        <div class="breadcrumb-area breadcrumb-img bg-img" data-bg="assets/img/banner/shop.jpg">
            <div class="container">
                <div class="row">
                    <div class="col-12">
                        <div class="breadcrumb-wrap">
                            <nav aria-label="breadcrumb">
                                <h3 class="breadcrumb-title">MY ACCOUNT</h3>
                                <ul class="breadcrumb justify-content-center">
                                    <li class="breadcrumb-item"><a href="index.html"><i class="fa fa-home"></i></a></li>
                                    <li class="breadcrumb-item active" aria-current="page">My Account</li>
                                </ul>
                            </nav>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <!-- breadcrumb area end -->

        <!-- my account wrapper start -->
        <div class="my-account-wrapper section-padding">
            <div class="container">
                <div class="section-bg-color">
                    <div class="row">
                        <div class="col-lg-12">
                            <!-- My Account Page Start -->
                            <div class="myaccount-page-wrapper">
                                <!-- My Account Tab Menu Start -->
                                <div class="row">
                                    <div class="col-lg-3 col-md-4">
                                        <div class="myaccount-tab-menu nav" role="tablist">
                                            <a href="#dashboad" class="active" data-toggle="tab"><i class="fa fa-dashboard"></i>
                                                个人信息</a>
                                            <a href="#orders" data-toggle="tab"><i class="fa fa-cart-arrow-down"></i>
                                                我的订单</a>
                                           
                                            <a href="#payment-method" data-toggle="tab"><i class="fa fa-credit-card"></i>
                                               修改密码</a>
                                            <a href="#address-edit" data-toggle="tab"><i class="fa fa-map-marker"></i>
                                               收货地址</a>
                                            <a href="#account-info" data-toggle="tab"><i class="fa fa-user"></i>账户信息</a>
                                            <a href="${pageContext.request.contextPath }/Logout"><i class="fa fa-sign-out"></i>退出登录</a>
                                        </div>
                                    </div>
                                    <!-- My Account Tab Menu End -->

                                    <!-- My Account Tab Content Start -->
                                    <div class="col-lg-9 col-md-8">
                                        <div class="tab-content" id="myaccountContent">
                                            <!-- Single Tab Content Start -->
                                            <div class="tab-pane fade show active" id="dashboad" role="tabpanel">
                                                <div class="myaccount-content">
                                                    <h5>我的主页</h5>
                                                    <div class="welcome">
                                                        <p>Hello, <strong>${user.username }</strong> (If Not <strong>${user.username }!</strong><a href="${pageContext.request.contextPath }/Logout" class="logout"> Logout</a>)</p>
                                                    </div><p class="mb-0">从您的个人信息页面。你可以很容易地查看您最近的订单，管理您的发货和账单地址并编辑您的密码和帐户详细信息。</p>
                                                </div>
                                            </div>
                                            <!-- Single Tab Content End -->

                                            <!-- Single Tab Content Start -->
                                            <div class="tab-pane fade" id="orders" role="tabpanel">
                                                <div class="myaccount-content">
                                                    <h5>Orders</h5>
                                                    <div class="myaccount-table table-responsive text-center">
                                                        <table class="table table-bordered">
                                                            <thead class="thead-light">
                                                                <tr>
                                                                    <th>我的订单</th>
                                                                    <th>创建日期</th>
                                                                    <th>订单状态</th>
                                                                    <th>订单金额</th>
                                                                    <th>操作</th>
                                                                </tr>
                                                            </thead>
                                                            <tbody>
                                                                <tr>
                                                                    <td>1</td>
                                                                    <td>Aug 22, 2018</td>
                                                                    <td>Pending</td>
                                                                    <td>$3000</td>
                                                                    <td><a href="cart.html" class="btn btn-sqr">View</a>
                                                                    </td>
                                                                </tr>
                                                                <tr>
                                                                    <td>2</td>
                                                                    <td>July 22, 2018</td>
                                                                    <td>Approved</td>
                                                                    <td>$200</td>
                                                                    <td><a href="cart.html" class="btn btn-sqr">View</a>
                                                                    </td>
                                                                </tr>
                                                                <tr>
                                                                    <td>3</td>
                                                                    <td>June 12, 2017</td>
                                                                    <td>On Hold</td>
                                                                    <td>$990</td>
                                                                    <td><a href="cart.html" class="btn btn-sqr">View</a>
                                                                    </td>
                                                                </tr>
                                                            </tbody>
                                                        </table>
                                                    </div>
                                                </div>
                                            </div>
                                            <!-- Single Tab Content End -->

                                           

                                            <!-- Single Tab Content Start -->
                                            <div class="tab-pane fade" id="payment-method" role="tabpanel">
                                                <div class="myaccount-content">
                                                    <h5>修改密码</h5>
                                                     <div class="account-details-form">
                                                        <form action="${pageContext.request.contextPath }/UserInfoServlet" id="changepassword">
                                                          <input type="hidden" name="method" value="changepassword">
                                                          <input type="hidden" name="hidusername" value="${user.username }">
                                                           <div class="single-input-item">
                                                                <label for="oldpassword" class="required">原始密码:</label>
                                                                <input type="password" id="oldpassword" placeholder="请输入原始密码" name="oldpassword" />
                                                      </div>
                                                      <div class="single-input-item">
                                                                <label for="newpassword" class="required">新密码:</label>
                                                                <input type="password" id="newpassword" placeholder="请输入新密码：" name="newpassword" />
                                                      </div>
                                                            <div class="single-input-item">
                                                                <label for="passwordagain" class="required">确认密码：</label>
                                                                <input type="password" id="passwordagain" placeholder="请确认密码：" name="passwordagain" />
                                                            </div>
                                                             <div class="single-input-item">
                                                             	<span>${changepwdinfo }</span>
                                                                <button  class="btn btn-sqr" id="changepwd">确认修改</button>  										
                                                            </div>  	
                                                        </form>
                                                    </div>
                                                   
                                                </div>
                                            </div>
                                            <!-- Single Tab Content End -->

                                            <!-- Single Tab Content Start -->
                                            <div class="tab-pane fade" id="address-edit" role="tabpanel">
                                                <div class="myaccount-content">
                                                    <h5>收货地址</h5>
                                                    <address>
                                                        <p><strong>Erik Jhonson</strong></p>
                                                        <p>1355 Market St, Suite 900 <br>
                                                            San Francisco, CA 94103</p>
                                                            <p>Mobile: (123) 456-7890</p>
                                                    </address>
                                                    <a href="#" class="btn btn-sqr"><i class="fa fa-edit"></i>
                                                        Edit Address</a>
                                                </div>
                                            </div>
                                            <!-- Single Tab Content End -->

                                            <!-- Single Tab Content Start -->
                                            <div class="tab-pane fade" id="account-info" role="tabpanel">
                                                <div class="myaccount-content">
                                                    <h5>个人信息</h5>
                                                    <div class="account-details-form">
                                                        <form action="${pageContext.request.contextPath }/UserInfoServlet" id="userinfofrom">
                                                           	<input type="hidden" name="method" value="saveuserinfo">
                                                            <div class="row">
                                                                <div class="col-lg-6">
                                                                    <div class="single-input-item">
                                                                        <label for="username" class="required">用户名：</label>
                                                                        <input type="text" id="username" placeholder="用户名"  name="username" readonly="true" value="${user.username }"/>
                                                                    </div>
                                                                </div>
                                                                <div class="col-lg-6">
                                                                    <div class="single-input-item">
                                                                        <label for="realname" class="required">真实姓名：</label>
                                                                        <input type="text" id="realname" placeholder="请输入真实姓名：" name="realname" value="${user.realname }"/>
                                                                    </div>
                                                                </div>
               
                                                            </div>
                                                             
                    										<div class="single-input-item">
                                                                <label for="usersex" class="required">性别：</label>
                                                                <input type="text" id="usersex" placeholder="请输入性别（男/女）：" name="usersex" value="${user.usersex }"/>
                                                            </div>
                                                            <div class="single-input-item">
                                                                <label for="userphone" class="required">电话号：</label>
                                                                <input type="text" id="userphone" placeholder="请输入电话号：" name="userphone" value="${user.userphone }"/>
                                                            </div>
                                                            <div class="single-input-item">
                                                                <label for="useremail" class="required">邮箱：</label>
                                                                <input type="email" id="useremail" placeholder="请输入邮箱：" name="useremail" value="${user.useremail }"/>
                                                            </div>
                                                        
                                                            <div class="single-input-item">
                                                                <button  class="btn btn-sqr" id="saveuserinfo">保存</button>  										
                                                            </div>
                                                        </form>
                                                    </div>
                                                </div>
                                            </div> <!-- Single Tab Content End -->
                                        </div>
                                    </div> <!-- My Account Tab Content End -->
                                </div>
                            </div> <!-- My Account Page End -->
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <!-- my account wrapper end -->
    </main>






    <!-- JS
============================================ -->

    <!-- Modernizer JS -->
    <script src="assets/js/vendor/modernizr-3.6.0.min.js"></script>
    <!-- jQuery JS -->
    <script src="assets/js/vendor/jquery-3.3.1.min.js"></script>
    <!-- Popper JS -->
    <script src="assets/js/vendor/popper.min.js"></script>
    <!-- Bootstrap JS -->
    <script src="assets/js/vendor/bootstrap.min.js"></script>
    <!-- slick Slider JS -->
    <script src="assets/js/plugins/slick.min.js"></script>
    <!-- Countdown JS -->
    <script src="assets/js/plugins/countdown.min.js"></script>
    <!-- Nice Select JS -->
    <script src="assets/js/plugins/nice-select.min.js"></script>
    <!-- jquery UI JS -->
    <script src="assets/js/plugins/jqueryui.min.js"></script>
    <!-- Image zoom JS -->
    <script src="assets/js/plugins/image-zoom.min.js"></script>
    <!-- image loaded js -->
    <script src="assets/js/plugins/imagesloaded.pkgd.min.js"></script>
    <!-- masonry  -->
    <script src="assets/js/plugins/masonry.pkgd.min.js"></script>
    <!-- mailchimp active js -->
    <script src="assets/js/plugins/ajaxchimp.js"></script>
    <!-- contact form dynamic js -->
    <script src="assets/js/plugins/ajax-mail.js"></script>
    <!-- google map api -->
    <script src="http://ditu.google.cn/maps/api/js?key=AIzaSyCfmCVTjRI007pC1Yk2o2d_EhgkjTsFVN8"></script>
    <!-- google map active js -->
    <script src="assets/js/plugins/google-map.js"></script>
    <!-- Main JS -->
    <script src="assets/js/main.js"></script>
    
    
    <!-- JS Library-->
	<script type="text/javascript" src="plugins/jquery/dist/jquery.min.js"></script>
	<script type="text/javascript" src="plugins/bootstrap/dist/js/bootstrap.min.js"></script>
	<script type="text/javascript" src="plugins/jquery-bar-rating/dist/jquery.barrating.min.js"></script>
	<script type="text/javascript" src="plugins/owl-carousel/owl.carousel.min.js"></script>
	<script type="text/javascript" src="plugins/gmap3.min.js"></script>
	<script type="text/javascript" src="plugins/imagesloaded.pkgd.js"></script>
	<script type="text/javascript" src="plugins/isotope.pkgd.min.js"></script>
	<script type="text/javascript" src="plugins/bootstrap-select/dist/js/bootstrap-select.min.js"></script>
	<script type="text/javascript" src="plugins/jquery.matchHeight-min.js"></script>
	<script type="text/javascript" src="plugins/slick/slick/slick.min.js"></script>
	<script type="text/javascript" src="plugins/elevatezoom/jquery.elevatezoom.js"></script>
	<script type="text/javascript" src="plugins/Magnific-Popup/dist/jquery.magnific-popup.min.js"></script>
	<script type="text/javascript" src="plugins/jquery-ui/jquery-ui.min.js"></script>
	<script type="text/javascript"
		src="http://ditu.google.cn/maps/api/js?key=AIzaSyAx39JFH5nhxze1ZydH-Kl8xXM3OK4fvcg&amp;region=GB"></script>
	<script type="text/javascript" src="plugins/revolution/js/jquery.themepunch.tools.min.js"></script>
	<script type="text/javascript" src="plugins/revolution/js/jquery.themepunch.revolution.min.js"></script>
	<script type="text/javascript" src="plugins/revolution/js/extensions/revolution.extension.video.min.js"></script>
	<script type="text/javascript" src="plugins/revolution/js/extensions/revolution.extension.slideanims.min.js">
	</script>
	<script type="text/javascript" src="plugins/revolution/js/extensions/revolution.extension.layeranimation.min.js">
	</script>
	<script type="text/javascript" src="plugins/revolution/js/extensions/revolution.extension.navigation.min.js">
	</script>
	<script type="text/javascript" src="plugins/revolution/js/extensions/revolution.extension.parallax.min.js"></script>
	<script type="text/javascript" src="plugins/revolution/js/extensions/revolution.extension.actions.min.js"></script>
	<script type="text/javascript" src="plugins/revolution/js/extensions/revolution.extension.kenburn.min.js"></script>
	<script type="text/javascript" src="plugins/revolution/js/extensions/revolution.extension.migration.min.js">
	</script>
	<!-- Custom scripts-->
	<script type="text/javascript" src="js/main.js"></script>
	<script type="text/javascript" src="js/index.js"></script>
	
<script type="text/javascript">
$(function(){

$("#saveuserinfo").click(function(){
	
	$("#userinfofrom").submit();

});
$("#changepwd").click(function(){
	var user="<%session.getAttribute("user");%>"
	if(user!=null)}{
		if($("#newpassword").attr("value")===$("#passwordagain").attr("value")){
			alert("两次输入密码不一致！");
			return;
		}
		$("#changepassword").submit();
	}else{
		alert("请先登录！");
		"<%response.setHeader("refresh", "2;url="+request.getContextPath()+"/login.jsp"); %>"
	}
	$("#changepassword").submit();
});
var saveinfostatus="<%session.getAttribute("saveinfostatus");%>";
	if( saveinfostatus !="" ){
		alert(saveinfostatus);
		"<% session.setAttribute("saveinfostatus", "");%>";
	} 
});
</script>
</body>
</html>